<%@ page contentType="text/html;charset=UTF-8" language="java" import="com.lee.dhsg.domain.Student" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<%
    Student student = (Student) session.getAttribute("StudentSession");
%>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" href="css/bootstrap.css" />
    <script type="text/javascript" src="js/jquery.min.js" ></script>
    <script type="text/javascript" src="js/bootstrap.min.js" ></script>
    <script type="text/javascript" src="js/jquery.validate.js" ></script>
    <script type="text/javascript" src="js/messages_zh.js" ></script>
    <link rel="stylesheet" href="css/other.css" />
</head>
<style>
    #visit-class-list .navbar-nav{position: relative;}
    #visit-class-list .navbar-nav ul{position: absolute;}
</style>
<body>

<!--主页模态窗-->
<div>
    <!--登陆选择身份-->
    <div class="container">
        <div class="modal fade" id="Mymodal-1">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button class="close" data-dismiss="modal">&times;</button>
                        <h4>你的身份是？</h4>
                    </div>
                    <div class="modal-body">
                        <div class="row">
                            <ul class="nav navbar-nav navbar-collapse">
                                <li><a href="#" data-toggle="modal" data-target="#Mymodal-teacher-login"
                                       data-dismiss="modal">老师</a></li>
                                <li><a href="#" data-toggle="modal" data-target="#Mymodal-student-login"
                                       data-dismiss="modal">学生</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--注册选择身份-->
    <div class="container">
        <div class="modal fade" id="Mymodal-2">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button class="close" data-dismiss="modal">&times;</button>
                        <h4>你的身份是？</h4>
                    </div>
                    <div class="modal-body">
                        <div class="row">
                            <ul class="nav navbar-nav navbar-collapse">
                                <li><a href="#" data-toggle="modal" data-target="#Mymodal-teacher-signup"
                                       data-dismiss="modal">老师</a></li>
                                <li><a href="#" data-toggle="modal" data-target="#Mymodal-student-signup"
                                       data-dismiss="modal">学生</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--老师登陆 -->
    <div class="container">
        <div class="modal fade" id="Mymodal-teacher-login">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <form name="teacherLogin" action="teacherLogin" method="post">
                        <div class="modal-header">
                            <button class="close" data-dismiss="modal">&times;</button>
                            <h4>老师</h4>
                        </div>
                        <div class="modal-body">
                            <div class="form-group">
                                <label>用户名</label>
                                <input type="text" class="form-control" name="username">
                            </div>
                            <div class="form-group">
                                <label>密码</label>
                                <input type="password" class="form-control" name="password">
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button class="btn btn-primary">确定</button>
                            <button class="btn btn-default" data-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!--学生登陆-->
    <div class="container">
        <div class="modal fade" id="Mymodal-student-login">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <form name="studentLogin" action="studentLogin" method="post">
                        <div class="modal-header">
                            <button class="close" data-dismiss="modal">&times;</button>
                            <h4>学生</h4>
                        </div>
                        <div class="modal-body">
                            <div class="form-group">
                                <label>用户名/手机/邮箱</label>
                                <input type="text" class="form-control" name="username">
                            </div>
                            <div class="form-group">
                                <label>密码</label>
                                <input type="password" class="form-control" name="password">
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button class="btn btn-primary">确定</button>
                            <button class="btn btn-default" data-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!--老师注册-->
    <div class="container">
        <div class="modal fade" id="Mymodal-teacher-signup">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <form name="teacherRegister" action="teacherRegister" method="post">
                        <div class="modal-header">
                            <button class="close" data-dismiss="modal">&times;</button>
                            <h4>老师</h4>
                        </div>
                        <div class="modal-body">
                            <div class="form-group">
                                <label>用户名/手机/邮箱</label>
                                <input type="text" class="form-control" name="username">
                            </div>
                            <div class="form-group">
                                <label>密码</label>
                                <input type="password" class="form-control" name="password">
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button class="btn btn-primary">确定</button>
                            <button class="btn btn-default" data-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- 学生注册-->
    <div class="container">
        <div class="modal fade" id="Mymodal-student-signup">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <form name="studentRegister" action="studentRegister" method="post">
                        <div class="modal-header">
                            <button class="close" data-dismiss="modal">&times;</button>
                            <h4>学生</h4>
                        </div>
                        <div class="modal-body">
                            <div class="form-group">
                                <label>用户名/手机/邮箱</label>
                                <input type="text" class="form-control" name="username">
                            </div>
                            <div class="form-group">
                                <label>密码</label>
                                <input type="password" class="form-control" name="password">
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button class="btn btn-primary">确定</button>
                            <button class="btn btn-default" data-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<!--导航模块-->
<nav class="navbar navbar-default">
    <div class="container">
        <div class="navbar-header">
            <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="index" class="navbar-brand">大好时光</a>
        </div>
        <div class="navbar-collapse collapse">
            <div class="input-append">
                <input class="span2" id="appendedInputButton" type="text">
                <button class="btn" type="button">搜索</button>
                <ul class="nav navbar-nav navbar-right">
                    <%
                        if (student != null) {
                    %>
                    <li>
                        <img src="<%=student.getIcon()%>" class="img-circle"/>
                    </li>
                    <li><%=student.getUsername()%> ! 你好啊！喝茶还是喝咖啡？</li>
                    <li><a href="studentLogout">退出登陆</a></li>
                    <%
                    } else {
                    %>
                    <li class="divider-vertical"></li>
                    <li><a href="#" data-toggle="modal" data-target="#Mymodal-1">登陆</a></li>
                    <li class="divider-vertical"></li>
                    <li><a href="#" data-toggle="modal" data-target="#Mymodal-2">注册</a></li>
                    <%
                        }
                    %>
                </ul>
            </div>
        </div>
    </div>
</nav>

<!--课程模块-->
<div class="container">
    <div class="row">
        <%-- 展示课程 --%>
        <c:forEach items="${courseList}" var="course" varStatus="st">
            <div class="col-md-3">
                <img src="${course.img}"/>
                <h3>${course.cname}</h3>
                <p>${course.courseDescription}</p>
            </div>
        </c:forEach>
    </div>
</div>



</body>
<script>
    $(window).scroll(function () {
        if ($(".navbar").offset().top > 50) {$(".navbar-fixed-top").addClass("top-nav");
        }else {$(".navbar-fixed-top").removeClass("top-nav");}
    })
    $(function(){

        $('.carousel-control').css('line-height',$('.carousel-inner img').height()+'px');
        $(window).resize(function(){
            var $height = $('.carousel-inner img').eq(0).height()	||
                $('.carousel-inner img').eq(1).height()   ||
                $('.carousel-inner img').eq(2).height();
            $('.carousel-control').css('line-height',$height+'px');
        })
    })
    $(function(){
        $('#myCarousel').carousel({
            interval:3000,
        })
    })

    $('#myModal').modal().css({
        'margin-top': function () {
            return ($(this).height() * 0.5);
        }
    });


</script>
</html>